﻿<%@ Page Language="C#" AutoEventWireup="true" Inherits="FL.Web.BackEnd.BasePage" %>

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>选择人员</title>
    <style>
         .col {
            float: left;
            width: 200px;
            border:solid 1px #ddd;
            margin-right:1px;
            padding:0px;
            border:solid 1px #808080;
            height:300px;
            overflow:auto;
        }
         .col2{
            float: left;
            width: 35px;
            padding:1px;
            height:300px;
            font-size:12px;
            vertical-align:middle;
            text-align:center;
         }
        .col>table{
            width:100%;
        }
        .col > input {
            width: 99.99%;
        }
        input[type=input]
        {
            width:250px;
        }
    </style>
</head>
<script src="/SFramework/boot.js"></script>
<body style="margin: 0px; padding: 0px">
   
     <div style="padding:5px;"><input type="text" id="txtSearch" placeholder="请输入姓名" style="width:250px;"/><input type="button" id="btnSearch" value="搜索" /></div>
     <div class="col">
        <ul id="tree1" class="mini-tree" url="/extendpage/data/jsondata.aspx?entity=<%=GetStringFromQueryString("masterentity","t_base_department") %>&condition=<% =GetStringFromQueryString("master_condition","") %>&type=1&order=<% =GetStringFromQueryString("master_order","") %>" style="width: 100%;"
            showtreeicon="true" textfield="name" idfield="id" parentfield="parent_id" resultastree="false" expandonload="true">
        </ul>
     </div>   
     <div class="col">
          <div id="datagrid1" class="mini-datagrid" allowresize="true" allowscroll="true"
            editnextonenterkey="true" editnextrowcell="true" idfield="id" multiselect="true" showpager="false" pagesize="500" style="height:300px;">
            <div property="columns">
                <div name="name" field="name" width="165">姓名</div>
            </div>
            </div>

        </div>
 
       <div class="col2"><input type="button" id="btnJoinRight" value=">>"/>
          <input type="button" id="btnRightRemove" value="<<"/>
        </div>
     <div class="col">

            <div id="datagrid2" class="mini-datagrid" allowresize="true" allowscroll="true"   multiselect="true"
            editnextonenterkey="true" editnextrowcell="true" idfield="id" multiselect="true" showpager="false" pagesize="500" style="height:300px;">
                <div property="columns">
                    <div name="name" field="name" width="165">姓名</div>
                </div>
            </div>

        </div>
        <div class="toolbar" style="text-align:right;padding-right:20px;width:650px;margin-top:5px;float:left;">
            <button id="btnOK">确认</button>
            <button id="btnCancel">取消</button>
        </div>
    
</body>

<script type="text/javascript">
    mini.parse();

    var tree = mini.get("tree1");
    var grid = mini.get("datagrid1");
    var grid2 = mini.get("datagrid2");
    var treeId = null;
    tree.on("nodeselect", function (e) {
        if (typeof (fnCustomNodeSelect) == "function") {
            fnCustomNodeSelect(e);
            return;
        }
        treeId = e.node.id;
        const_TreeCustomCondition = "<%=GetStringFromQueryString("fkey","parent_id")%>='" + e.node.id + "'";
        grid.setUrl("/extendpage/data/jsondata.aspx?entity=<%=GetStringFromQueryString("entity","t_base_employee")%>&datagrid=true&pagesize=1000&condition=" + const_TreeCustomCondition);
        grid.load({});  
    });
    
    //$("#datagrid1").width($(document).width());
    //$("#datagrid1").height($(document).height() - 32); 
    //mini.parse();
    //var grid= mini.get("datagrid1")
    //grid.load({},fnDataBinding);
   
    //////////////////////////////////
    function CloseWindow(action) {
        if (window.CloseOwnerWindow)
        {
             return window.CloseOwnerWindow(action);
        }
        else
        {
             window.close();
        }
    }

    function fnGetData(){
        return grid2.data;
    }

    var _data = null;
    function fnSetData(data) {
        _data = data;
           $.each(data, function (i, e) {
                 var item = { id: e.id, name: e.name };
                   grid2.addRow(item,0);
                 
           })
 
        
    }

    function fnDataBinding(){
        grid.selects(_data, true )
    }

    function onOk() {
        CloseWindow("ok");        
    }
    function onCancel() {
        CloseWindow("cancel");
    }

    $("#btnJoinRight").click(function () {
       var rows = grid.getSelecteds();
       $(rows).each(function (index, e) {
           var data = grid2.data;
           var flag = false;
           $.each(data, function (i, e1) {
               if (e.id == e1.id) {
                   flag = true;
               }
           })
           if (flag == true)
           {
               return;
           }
           var item = { id: e.id, name: e.name };
           grid2.addRow(item, 0);
       });
    });

    $("#btnSearch").click(function(){
        var _condition = "name like '%"+$("#txtSearch").val()+"%'";
        grid.setUrl("/extendpage/data/jsondata.aspx?entity=<%=GetStringFromQueryString("entity","t_base_employee")%>&datagrid=true&pagesize=1000&condition="+encodeURI(_condition));
        grid.load({});
    });

    $("#btnRightRemove").click(function () {
        var rows = grid2.getSelecteds();
        grid2.removeRows(rows);
        //$(rows).each(function(index,e){
        //    grid2.removeRows(e);
        //});
    });

    $("#btnOK").click(function () {
        onOk();
    });
    
    $("#btnCancel").click(function(){
        onCancel();
    });
</script>
<script src="/Scripts/common/jquery.action.js"></script>
<script src="/Scripts/datagrid/list.common.button.js"></script>
</html>
